$('.city-choice').mousemove(function () {
    $('.dorpdown-layer').css('display', 'block');
})
$('.city-choice').mouseout(function () {
    $('.dorpdown-layer').css('display', 'none');
})
$('.li_dorpdown').mousemove(function () {
    $('.layer').css('display', 'block');
})
$('.li_dorpdown').mouseout(function () {
    $('.layer').css('display', 'none');
})
$('.shopCart-con').mousemove(function () {
    $('.shangpin').css('display', 'block');
})
$('.shopCart-con').mouseout(function () {
    $('.shangpin').css('display', 'none');
});



$.getJSON('../mock/brandZone.json', function (data) {
    showpage(data, 1);
    anmt()
    $('.brand-cate a').click(function () {
        $(this).addClass('clickRed').siblings().removeClass('clickRed');
        var avalue = $(this).text()
        var selArr = [];
        var reldata = [{
            "brandZone": selArr
        }]
        if (avalue == '全部品牌') {
            // console.log(data);
            // selArr.push(value);
            showpage(data, 1);
            anmt();
        } else {

            $(data[0].brandZone).each(function (index, value) {
                if (value.pinpai_name == avalue) {
                    selArr.push(value);
                }
            });
            showpage(reldata, 2);
            anmt();
        }
        goToTop()
    });
});

function showpage(sdata, bb) {
    var pageArr = [];
    for (var i = 0; i < sdata[0].brandZone.length; i++) {
        var pageDatas = `
    <li>
        <a href="javascript:;" class="img">
            <img src="${sdata[0].brandZone[i].goods_thumb.nowurl}" alt="">
            <div class="brand-desc">
            <div class="tit">品牌描述</div>
            <div class="info">暂无描述</div>
            </div><div class="mask"></div>
        </a>
        <div class="b-logo">
            <a href="javascript:;" class="follow">
                <i class="iconfont">&#xe601;</i>
                <span>关注</span>
            </a>
            <img src="${sdata[0].brandZone[i].goods_thumb.gallery_list}" alt="">
        </div>
        <div class="slogan">${sdata[0].brandZone[i].rz_shop_name}</div>
    </li>
    `;
        pageArr.push(pageDatas);
    }
    if (bb === 1) {
        // $(window).scroll().on();
        $('.items').empty();
        var aa = 1;
        $(window).scroll(function () {
            if ($('html').scrollTop() + $(window).innerHeight() >= $('html').innerHeight() - 200) {
                if (aa == 1) {
                    for (var j = 0; j < 24; j++) {
                        $(pageArr[j]).appendTo($('.items'))
                    };
                    aa += 1;
                } else if (aa == 2) {
                    for (var j = 24; j < 60; j++) {
                        $(pageArr[j]).appendTo($('.items'))
                    };
                    aa += 1;
                } else if (aa == 3) {
                    for (var j = 60; j < 84; j++) {
                        $(pageArr[j]).appendTo($('.items'))
                    };
                    aa += 1;
                } else if (aa == 4) {
                    for (var j = 80; j < pageArr.length; j++) {
                        $(pageArr[j]).appendTo($('.items'))
                    };
                    aa = 0;
                }
            }
        })
    } else if (bb === 2) {

        $(window).scroll().off();
        var datastr = '';
        for (var k = 0; k < pageArr.length; k++) {
            datastr += pageArr[k];
        };
        $('.items').html(datastr)
    }
}


function anmt() {
    // 鼠标移入商品，隐藏的盒子移动，关注出现，店铺logo消失
    $('.brand-list ul li').hover(function () {
        $(this).find('.brand-desc').stop().animate({
            top: 0,
        }, 300, 'linear');
        $(this).find('.mask').stop().animate({
            top: 0,
        }, 300, 'linear');
        $(this).find('.follow').css('opacity', 1);
        $(this).find('.b-logo img').css('display', 'none');
    }, function () {
        $(this).find('.brand-desc').stop().animate({
            top: 285,
        }, 300, 'linear');
        $(this).find('.mask').stop().animate({
            top: -285,
        }, 300, 'linear');
        $(this).find('.follow').css('opacity', 0);
        $(this).find('.b-logo img').css('display', 'block');
    });
}

goToTop()
function goToTop() {
    // 回到顶部
    $(window).scroll(function () {
        // $('.items').offset().top
        if ($('html').scrollTop() > 700) {
            $('.backTop').fadeIn();
        } else {
            $('.backTop').fadeOut();
        }
    });
    $('.backTop').click(function () {
        $('html').animate({
            scrollTop: 0
        }, 1000)
    });
}



// 侧边栏
// ----------------侧边栏通用(第一个)------------------------
var liEs = document.querySelectorAll('#quick_links ul li');
var ibar_login_box = document.querySelector('.ibar_login_box');
// console.log(liEs);
liEs[0].onmouseover = function () {
    ibar_login_box.style.display = 'block';
}
liEs[0].onmouseout = function () {
    ibar_login_box.style.display = 'none';
}
//---------------侧边栏(下面每一项)------------------------
var onEle = document.querySelectorAll('.ones');
var mp_tooltip = document.querySelectorAll('.mp_tooltip');
// console.log(onEle);
// console.log(mp_tooltip);
function side() {
    for (var i = 0; i < mp_tooltip.length; i++) {
        mp_tooltip[i].className = 'mp_tooltip';
    }
};
for (var j = 0; j < onEle.length; j++) {
    onEle[j].index = j;
    onEle[j].onmouseover = function () {
        side();
        mp_tooltip[this.index].className = 'mp_tooltip ele';
    }
    onEle[j].onmouseout = function () {
        side();
    }
}
// ---------------------------侧边栏右侧出现-------------------
var shopCart = document.querySelector('#shopCart');
var ibar_closebtn = document.querySelector('.ibar_closebtn');
var quick_links_wrap = document.querySelector('.quick_links_wrap');
shopCart.onclick = function () {
    quick_links_wrap.style.width = '320px';
}
ibar_closebtn.onclick = function () {
    quick_links_wrap.style.width = '40px';
}
$('.returnTop').click(function (e) {
    $("html").animate({
        scrollTop: 0
    }, 1000);
});
var mainOffsetTop = $("#brand").offset().top;
$(window).scroll(function (e) {
    if ($(window).scrollTop() >= mainOffsetTop) {
        $('.returnTop').addClass('show');
    } else {
        $('.returnTop').removeClass('show');
    }
});
$(function () {
    $(window).scroll(function () {
        if ($(window).scrollTop() >= 240) {
            $('.returnTop').addClass('show');

        } else {
            $('.returnTop').removeClass('show');
        }
    })
})